<template lang="html">
    <div class="video-push-history">
        <nav-header>
        <template slot="menuBefore">
            <li><router-link to="/resources/video/video-list">视频列表</router-link> </li>
            <li class="gap">&gt;</li>
        </template>
        </nav-header>
        <div class="zh-table">
        <div class="zh-table-open clear">
                    <div class="zh-open-left fl">
                        <div class="open-width" v-if="$store.state.checkLevel" style="width: 150px">
                            <el-select v-model="school_id" v-if="$store.state.platformInformation" filterable placeholder="教育局/学校">
                                <el-option
                                    v-for="item in schoolcodeData"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id">
                                </el-option>
                            </el-select>
                            <el-cascader
                            v-else placeholder="年级-科目"
                            v-model="valueEva"
                            :options="listID"
                            :props="optionProps">
                            </el-cascader>
                        </div>
                        <div class="open-width" v-else style="width: 180px">
                            <el-date-picker
                                type="daterange" 
                                :editable="false" 
                                :clearable="false"
                                range-separator="至" 
                                start-placeholder="开始日期" 
                                end-placeholder="结束日期" 
                                value-format="yyyy-MM-dd" 
                                v-model="pickerDate"
                                style="width: 100%;">
                            </el-date-picker>
                        </div>
                        <div class="open-width" style="width: 120px">
                            <el-select v-model="cate_id" filterable placeholder="全部类型">
                                <el-option
                                v-for="item in typeOption"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id">
                                </el-option>
                            </el-select>
                        </div>
                        <div class="open-width" style="width: 120px">
                            <el-select v-model="status_num" filterable placeholder="审批结果">
                                <el-option
                                v-for="item in statusOption"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                                </el-option>
                            </el-select>
                        </div>
                        <div class="open-width">
                            <el-input placeholder="视频名称、授课教师" v-model="keyword" @keyup.enter.native="search"></el-input>
                        </div>
                        <el-button type="primary" @click="search">搜索</el-button>
                        <el-button type="primary" @click="reset">重置</el-button>
                    </div>
                    <div class="zh-open-right fr">
                        <el-button type="danger" @click="delAll">批量删除</el-button>
                    </div>
                </div>
        <div class="zh-table-contents" v-loading="dataLoading.status" :element-loading-text="dataLoading.txt">
                    <el-table
                        v-if="$store.state.checkLevel"
                        :data="listData"
                        border
                        @selection-change="tableSelectionChange"
                        max-height="541"
                        style="width: 100%">
                        <el-table-column
                        fixed
                        type="selection"
                        width="50"
                        align="center"
                        >
                        </el-table-column>
                        <el-table-column
                        prop="video_name"
                        label="视频名称"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                <el-table-column
                        prop="category"
                        label="组织架构"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                <el-table-column
                        prop="teacher_name"
                        label="授课教师"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                        <el-table-column
                        prop="cate_name"
                        label="视频分类"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                <el-table-column
                        prop="create_time"
                        label="上传时间"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                <el-table-column
                        prop="push_time"
                        label="推送时间"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                        <el-table-column
                        prop="school_name"
                        label="推送至"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                        <el-table-column
                        prop="status_txt"
                        label="审批结果"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                        <el-table-column
                        fixed="right"
                        prop="handle"
                        label="操作"
                        align="center"
                        width="250"
                        show-overflow-tooltip
                        >
                        <template slot-scope="scope">
                            <el-button type="text" v-if="scope.row.status_txt === '待审核'" @click.stop="removeTergger(scope.row)">撤回</el-button>
                            <el-button type="text" v-if="scope.row.status_txt === '待提交'" @click.stop="resetSubmitTergger(scope.row)">重新提交</el-button>
                            <!-- v-if="scope.row.status_txt === '通过' || scope.row.status_txt === '拒绝' || scope.row.status_txt === '待提交'" -->
                            <el-button type="text"  class="delete-button" @click.stop="delTergger(scope.row,'one')">删除记录</el-button>
                        </template>
                        </el-table-column>
                    </el-table>
                    <el-table
                        v-else
                        :data="listData"
                        border
                        @selection-change="tableSelectionChange"
                        max-height="541"
                        style="width: 100%">
                        <el-table-column
                        fixed
                        type="selection"
                        width="50"
                        align="center"
                        >
                        </el-table-column>
                        <el-table-column
                        prop="res_name"
                        label="视频名称"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                        
                        <el-table-column
                        prop="res_type_name"
                        label="视频分类"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
            
                        <el-table-column
                        prop="size"
                        label="大小"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                
                        <el-table-column
                        prop="push_school"
                        label="推送至"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                        
                        <el-table-column
                        prop="status_name"
                        label="审批结果"
                        align="center"
                        show-overflow-tooltip
                        >
                        </el-table-column>
                        <el-table-column
                        fixed="right"
                        prop="handle"
                        label="操作"
                        align="center"
                        width="250"
                        show-overflow-tooltip
                        >
                        <template slot-scope="scope">
                            <el-button type="text" v-if="scope.row.status === 1" @click="removeTergger(scope.row)">撤回</el-button>
                            <el-button type="text" v-if="scope.row.status === 1" class="delete-button" @click="delTergger(scope.row,'one')">删除记录</el-button>
                            <el-button type="text"  v-if="scope.row.status === 3" @click="checkReject(scope.row)">查看原因</el-button>
                        </template>
                        </el-table-column>
                    </el-table>
                    <div class="table-pagination" v-show="total_number > 10">
                        <el-pagination
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                            :current-page="listParam.page_index"
                            :page-sizes="[10, 20, 30, 40, 50, 100]"
                            :page-size="listParam.page_size"
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="total_number">
                        </el-pagination>
                    </div>
                </div>
        </div>
        <el-dialog
        title="拒绝理由"
        :visible.sync="rejectFlag"
        :close-on-click-modal="false" 
        :close-on-press-escape="false"
        width="30%"
        >
        <div class="textarea-box" v-text="rejectTxt ? rejectTxt : '暂无拒绝理由'"></div>
        <span slot="footer" class="dialog-footer">
            <el-button @click="rejectFlag = false">取 消</el-button>
            <el-button type="primary" @click="rejectFlag = false">确 定</el-button>
        </span>
        </el-dialog>
        <el-dialog
        title="删除"
        :visible.sync="delFlag"
        :close-on-click-modal="false" 
        :close-on-press-escape="false"
        width="30%"
        >
        <div class="textarea-box">该直播进行中，删除该直播会导致直播结束，确认删除？</div>
        <span slot="footer" class="dialog-footer">
            <el-button @click="delFlag = false">取 消</el-button>
            <el-button type="primary" @click="delFlag = false">确 定</el-button>
        </span>
        </el-dialog>
        <el-dialog
        title="批量删除"
        :visible.sync="delAllFlag"
        :close-on-click-modal="false" 
        :close-on-press-escape="false"
        width="30%"
        >
        <div class="textarea-box">该直播进行中，删除该直播会导致直播结束，确认删除？</div>
        <span slot="footer" class="dialog-footer">
            <el-button @click="delAllFlag = false">取 消</el-button>
            <el-button type="primary" @click="delAllFlag = false">确 定</el-button>
        </span>
        </el-dialog>
    </div>
</template>

<script>
    export default {
    data() {
        return {
            listID: [],
            valueEva: [],
            optionProps: {
                value: "grade_id",
                label: "name",
            },
            app_code: sessionStorage.getItem('CheckSchoolAppCode'),
            schoolcodeData: [],/**存放学校教育局列表 */
            school_id: '',
            subject_id: '',
            grade_id: '',
            type: '',
            rowLen: 0,
            dataLoading:{
                status:false,
                txt:'获取数据...'
            },
            typeOption: [],
            status_num: '',
            statusOption: [
                {value: 1, label: '待审核'},
                {value: 2, label: '通过'},
                {value: 3, label: '拒绝'},
                {value: 4, label: '撤回'},
                {value: 5, label: '待提交'},
            ],
            delFlag: false,
            delAllFlag: false,
            rejectFlag: false,
            rejectTxt: '',/*拒绝理由 */
            listData: [],
            listParam: {
                type: '',
                keyword: '',
                start_time: '',
                end_time: '',
                page_index: 1,
                page_size: 10,
                cate_id: '',
                school_id: '',
                grade_id: '',
                subject_id: ''
            },
            cate_id: '',
            keyword: '',
            pickerDate: [],
            total_number: 0,
            status: ['删除','通过','待审核','拒绝','移除','撤销'],/*记录状态 */
            ids: [],
        }
    },
    mounted() {},
    created() {
        this.findAideoKind()
        this.get_schoolcode()
        this.getOrgnk()
    },
    methods: {
        // ------------------------------------------------------------------
        get_schoolcode(){ /*获取学校教育局 */
            let params = {
                app_code: this.app_code
            }
            let success = res => {
                // console.log(res, 'pppp')
                this.schoolcodeData = res.data
                this.listParam.school_id = res.data[0].id
                this.getList()
            }
            this.$ajax.get('api/group/get_platform_org', {params, func: {success}})
        },
        getOrgnk() {
        let params = {
            app_code: this.app_code
        }
        let success = (res) => {
            this.listID = res.data.children
             console.log(this.listID, 'this.listID')
        };
        this.$ajax.get('api/network/get_org_subject', {params,func: {success}})
        },
        /**
         * 获取视频分类
         */
        findAideoKind() {
            let success = res => {
                // console.log(res.data)
                this.typeOption = res.data
            }
            this.$ajax.get('api/video/video_cate',{func:{success}})
        },
        // --------------------------------------------------------------------------------------------
        getList() {
        this.dataLoading.status = true;
        const success = res=> {
            console.log(JSON.parse(JSON.stringify(res.data.data)))
            this.dataLoading.status = false;
            this.listData = res.data.data;
            this.total_number = res.data.data_sum;
            this.listData.forEach(item=>{
            item.statusTxt = this.status[parseInt(item.status)];
            })
        }
        this.$ajax.get('api/video/video_pushed_history', { params: this.listParam,func: {success: success}})
        },
        search() {
        this.listParam.grade_id = this.valueEva[0]
        this.listParam.subject_id = this.valueEva[1]
        this.listParam.cate_id = this.cate_id
        this.listParam.school_id = this.school_id
        this.listParam.status = this.status_num;
        this.listParam.keyword=this.keyword;
        this.listParam.start_time= this.pickerDate.length > 0 ? this.pickerDate[0] : '';
        this.listParam.end_time= this.pickerDate.length > 0 ? this.pickerDate[1] : '';
        this.listParam.page_index=1;
        this.getList();
        },
        reset() {
        this.grade_id = ''
        this.cate_id = ''
        this.keyword = '';
        this.pickerDate = [];
        this.status_num = ''
        this.school_id = ''
        this.listParam = {
            type: 0,
            status_num: '',
            keyword: '',
            cate_id: '',
            start_time: '',
            end_time: '',
            page_index: 1,
            page_size: 10,
            school_id: '',
            grade_id: '',
        }
        this.valueEva = []
        this.getList();
        },
        tableSelectionChange(val) {
        this.ids = [];
        if(val.length > 0) {
            val.forEach(item=>{
            this.ids.push(item.id);
            })
        }
        },
        handleSizeChange(size) {
        this.listParam.page_size = size;
        this.getList();
        },
        handleCurrentChange(page) {
        this.listParam.page_index = page;
        this.getList();
        },
        toLink(link) {
        this.$router.push(link);
        },
        checkReject(obj) {/*查看拒绝理由 */
        this.rejectFlag = true;
        this.rejectTxt = obj.comment;
        },
        delAll() {/*批量删除记录 */
            if(this.ids.length <= 0) {
                this.$message.warning('请选择要删除的选项');
                return false;
            }
            const cancel = (res => {})
            const yes = (res => {
                this.listData.forEach((item, index) =>{
                    this.ids.forEach((itm, idx) =>{
                        if(item.id == itm) {
                            this.del(itm)
                        }
                    })
                })
            })
            this.e_confirm({yes, cancel, txt: "确定要删除选中的记录吗？"});
        },
        delTergger(obj,type) {/*删除提示 */
            console.log(obj,type)
            this.$confirm('确定要执行此操作吗?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                if(Object.is(type, 'one')) {
                    this.rowLen = 1;
                    this.del(obj.id);
                } else {
                    this.del();
                }          
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });          
            });
        },
        del(id) {/*删除单个 */ 
            let params = {
                id: id
            }
            const success=res=>{
                this.$message.success(res.msg);
                this.getList();
            }
            this.$ajax.delete('api/video/video_pushed_history',{params, func: {success}})
        },
        remove(id) {/*撤回 */
        let params = {
            id: id,
        }
        const success=res=>{
            this.$message.success(res.msg);
            this.getList();
        }
        this.$ajax.put('api/video/video_pushed_history',params,{func:{success:success}})
        // this.$ajax.put('api/level/repeal_pushed_receive',params,{func:{success:success}})
        },
        removeTergger(obj) {/*撤回提示 */
        this.$confirm('确定要执行此操作吗?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
            }).then(() => {
            this.remove(obj.id);   
            }).catch(() => {
            this.$message({
                type: 'info',
                message: '已取消撤回'
            });          
            });
        },
        resetSubmit(obj) { /**重新提交 */
            let params = {
            video_id: obj.video_id,
            id: obj.id,
            }
            const success=res=>{
                this.$message.success(res.msg);
                this.getList();
            }
            this.$ajax.post('api/video/video_pushed_history',params,{func:{success:success}})
        },
        resetSubmitTergger(obj) { /**重新提交 */
            this.$confirm('确定要执行此操作吗?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
            }).then(() => {
            this.resetSubmit(obj);
            }).catch(() => {
            this.$message({
                type: 'info',
                message: '已取消提交'
            });          
            });
        }
    },
    }
</script>
